@media all {
  body {
    font-size: 2rem;
    text-decoration: underline;
  }
}

@media screen {
  body {
    color: red;
  }
}

@media print {
  body {
    color: blue;
  }
}

@media (max-width: 800px) {
  h1 {
    border: 5px solid;
  }
}

@media (min-width: 800px) {
  h1 {
    background: yellow;
  }
}

@media (orientation: portrait) {
  h1::before {
    content: "竖屏";
  }
}

@media (orientation: landscape) {
  h1::before {
    content: "横屏";
  }
}

// @media screen and (max-width: 500px) and (orientation: portrait) {
//   h1 {
//     font-style: italic;
//   }
// }

// @media not screen {
//   h1 {
//     font-style: italic;
//   }
// }

@media only print {
  h1 {
    font-style: italic;
  }
}
